<template>
    <div>
        <v-header></v-header>
        <div class="main">
            <div class="wrapper">
                <!-- <v-sidebar :sideNav='sideNav' :scrolled='scrolled'></v-sidebar> -->
                <v-sidebar :scrolled='scrolled'></v-sidebar>
                <div class="content">
                    <transition name="slide-left" mode="out-in">
                        <router-view></router-view>
                    </transition>
                </div>
            </div>
        </div>
        <v-footer></v-footer>
    </div>
</template>

<script>
    import { config } from '@/config.js'
    import vHeader from '../common/Header.vue';
    import vFooter from '../common/Footer.vue';
    import vSidebar from '../common/Sidebar.vue';
    export default {
        data() {
            return {
                scrolled: false,
                // 侧导航栏信息
                sideNav: {
                    column: 'basedata',
                    list: [],
                },
            }
        },
        beforeCreate() { //el和data并未初始化
        },
        computed: {
            // 读取和设置
            menuId: {
                get: function() {
                    if (this.$store.getters.getMenuId == null) {
                        this.$store.commit("SET_MENUID", localStorage.getItem(config.FIRST_MENU_ID))
                    }
                    return this.$store.getters.getMenuId;
                },
                set: function(v) {
                    this.$store.commit("SET_MENUID", v);
                }
            }
        },
        mounted() {
            this.getMenu(this.menuId);
            window.addEventListener('scroll', this.handleScroll);
        },
        watch: { // 完成组件挂载
            menuId(val, oldVal) {
                this.getMenu(val);
            },
        },
        methods: {
            getMenu(menuId) {
                this.$nextTick(function() {
                    //获取 localStorage 的存储数据
                    // let olist = JSON.parse(localStorage.getItem("menuList"));
                    // this.sideNav.list = [];
                    // console.log('olist.length');
                    // console.log(olist.length);
                    // for (var i = 0; i < olist.length; i++) {
                    //     if (olist[i].id == menuId) {
                    //         this.sideNav.list.push(olist[i]);
                    //     }
                    // }
                })
            },
            handleScroll() {
                this.scrolled = window.scrollY > 60;
            }
        },
        components: {
            vHeader,
            vSidebar,
            vFooter
        }
    }
</script>

<style>

</style>
